import React, {useEffect, useState} from 'react';
import {Button, Table, Tag} from 'antd';
import './SupplierOrderList.scss';

function SupplierOrderList({supplierOrderList, deliverGoods, confirmReceipt}) {

  const [columns, setColumns] = useState([
    {
      title: '订单号',
      dataIndex: 'order_no',
      key: 'order_no'
    },
    {
      title: '供应商',
      dataIndex: 'vendor_name',
      key: 'vendor_name'
    },
    {
      title: '付款时间',
      dataIndex: 'pay_time',
      key: 'pay_time'
    }, {
      title: '付款金额',
      dataIndex: 'goods_price',
      key: 'goods_price'
    }, {
      title: '运费',
      dataIndex: 'freight_price',
      key: 'freight_price'
    }, {
      title: '订单状态',
      key: 'status',
      render: (text, record) => {
        // 订单状态(1已支付订单2已发货订单【部分或者全部发货】3订单完成4未确认收款)
        return <div className='BeforeOperatedAction'>
          {
            text.ship === 1 ? <Tag size='small' color={'gold'}>已发货</Tag> : <Tag size='small' color={'green'}>未发货</Tag>
          }
        </div>;
      }
    }, {
      title: '备注',
      dataIndex: 'remark',
      key: 'remark'
    }, {
      title: '操作',
      key: 'action',
      render: (text, record) => {
        // 订单状态(1已支付订单2已发货订单【部分或者全部发货】3订单完成4未确认收款)
        // ship    1:已发货 0:未发货
        return <div className='BeforeOperatedAction'>
          {
            text.ship === 0 &&
            <Button
              size='small'
              type={'primary'}
              onClick={() => deliverGoods(text.order_no, text.supplier_id, text.receipt_address_id)}
            >发 货
            </Button>
          }
          {/*{*/}
          {/*  text.ship === 1 &&*/}
          {/*  <Button size='small' type={'primary'} onClick={() => confirmReceipt( text.refund_no)}>收 货</Button>*/}
          {/*}*/}
          {
            text.ship === 1 && <Tag size='small' color={'magenta'}>已发货</Tag>
          }

        </div>;
      }
    }

  ]);

  return (
    <div className={'SupplierOrderList'}>
      <Table dataSource={supplierOrderList} columns={columns} pagination={false}/>
    </div>
  );
}

export default SupplierOrderList;
